/**
 * 查看协议
 * fuxueyan
 */
import { Modal } from 'antd';
import React from 'react';

type Props = {
  handleCancel: any;
  userRole: string;
};

const SeeModal: React.FC<Props> = ({ handleCancel, userRole }) => {
  const shopAgree = [
    { key: '01' },
    { key: '02' },
    { key: '03' },
    { key: '04' },
    { key: '05' },
    { key: '06' },
    { key: '07' },
    { key: '08' },
    { key: '09' },
    { key: '10' },
    { key: '11' },
    { key: '12' },
    { key: '13' },
  ];
  const buyAgree = [
    { key: '01' },
    { key: '02' },
    { key: '03' },
    { key: '04' },
    { key: '05' },
    { key: '06' },
    { key: '07' },
    { key: '08' },
    { key: '09' },
    { key: '10' },
  ];
  return (
    <Modal
      visible={true}
      width={1000}
      title="查看协议"
      footer={null}
      onCancel={handleCancel}
      bodyStyle={{ padding: '20px 0', height: 700 }}
      closable={true}
    >
      {userRole === 'shop' ? (
        <>
          {shopAgree.map((item: any) => {
            return (
              <img
                key={item.key}
                src={require(`@/assets/agreement/shop/shopAgreement_${item.key}.png`)}
                alt={'加载失败'}
              />
            );
          })}
        </>
      ) : (
        <>
          {buyAgree.map((item: any) => {
            return (
              <img
                key={item.key}
                src={require(`@/assets/agreement/bug/buyAgreement_${item.key}.png`)}
                alt={'加载失败'}
              />
            );
          })}
        </>
      )}
    </Modal>
  );
};
export default SeeModal;
